import React from 'react';
import { useHistory } from 'react-router-dom';
import styles from './index.module.scss';
import StudyStyleTitle from '../../../components/study-style/study-style-title';
import FooterMethondImg from '../../../assets/result-page-img/footer-see';

const Footer = ({ data, index, type, percent }) => {
  // console.log('当前数据：',data,'当前下标',index,'当前风格',type,'当前小风格',data[index].type);
  const history = useHistory();
  const seeOtherStyle = () => {
    history.push({
      pathname: '/other_style',
      state: {
        type: type,
        index: index,
        data: data,
        percent: percent,
        currentStyle:data[index].type
      },
    });
  };

  return (
    <div className={styles.footer}>
      <StudyStyleTitle
        type={data[index].type + '_sm'}
        size="small"
        isShow={false}
      >
        {percent}
      </StudyStyleTitle>
      <img
        src={FooterMethondImg[type]}
        alt=""
        className={styles.footerMethod}
        onClick={seeOtherStyle}
      />
    </div>
  );
};

export default Footer;
